<!DOCTYPE html>
<html>
  <head>
    <title>oauth2 Application</title>
    <link href="css/styles.css" rel="stylesheet">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
  </head>
  <body>

    <div id="container">


      <input id="email" type="email" placeholder="Email">


	    <input id="password" type="password" placeholder="Password">


	    <div id="error_message"></div>


  	  <button class="small_button" type="submit" id="login_button">Login</button>

	    <a href="signup.html" class="right_link">Sign Up</a><br>

      <a id="forgot" href="forgot_password.html">Forgot Password</a>

    </div>


    <script src="js/jquery-1.8.2.min.js"></script>
    <script src="js/oauth2.js"></script>
    <script src="js/sha256.js"></script>
    <script src="js/enc-base64-min.js"></script>
    <script src="js/cookie.js"></script>
    <script src="js/user.js"></script>
    <script type="text/javascript">

    $(document).ready(function () {



      // Submit form on enter
      $('input').live('keydown', function (event) {
        if (event.keyCode === 13)
          $('#login_button').click()
      })

      if (oauth2.user.is_logged_in())
        window.location = 'dashboard.html'
      $('#login_button').on('click', function () {
        oauth2.user.login($('#email').val(), $('#password').val(), function (error) {
          if (!error)
            window.location = 'dashboard.html'
          else {
            console.log(error)
            $('#error_message').html('Email and/or password did not match a user account.').show()
          }
        })
      })

    })
    </script>
  </body>
</html>